<template>
  <view>
    <view class="logo_logo">
      <image src="@/static/logo.png" mode="scaleToFill" />
      <view>智慧聘</view>
    </view>
	<view class="form">
		<view class="form-item">
			<input type="number" placeholder="请输入手机号" placeholder-class="ipt-placeholder" v-model="phone">
		</view>
		<view class="form-item">
			<input v-if="!pswShow" type="password" placeholder="请输入密码" placeholder-class="ipt-placeholder" v-model="psw">
			<input v-if="pswShow" type="text" placeholder="请输入密码" placeholder-class="ipt-placeholder" v-model="psw">
			<view class="eye-box">
				<image @click="pswShow = !pswShow" :src="pswShow?'/static/login/eye.png':'/static/login/ey-close.png'" mode="" class="eye"></image>
			</view>
		</view>
		
	</view>
	<view class="register_btn" @click="login">
		登录
	</view>
	<view class="go_login" >
		<view class="inner_view">
			<text @click="resetPassword">忘记密码</text>
			<text class="line"></text>
			<text @click="register">去注册</text>
		</view>
	</view>
	<!-- <view class="flexcenter">
		<button class="login_btn " @click="login_info">
		  <image src="../../static/wxicon.png"></image>
		</button>
	</view> -->
    
    <view class="bottom">
    	<view class="btns">
    		<uni-icons v-if="!checked" @click="checked=true" type="circle" size="24"></uni-icons>
    		<uni-icons v-else type="checkbox-filled" color="#4A9CE7" @click="checked=false" size="24"></uni-icons>
    		<text>同意</text>
    		<text class="colortext" @click="userAgreement(1)">《用户协议》</text>
    		<text>和</text>
    		<text class="colortext" @click="userAgreement(2)">《隐私政策》</text>
    	</view>
    </view>
  </view>
</template>

<script>
	import WebSocket from '@/static/websocket.js' //websocket封装
export default {
  data() {
    return {
      logo_url: "ss",
      code: "",
	  phone:'',
	  psw:'',
	  pswShow:false,
	  checked:false,
	  websocket:null
    };
  },
  onLoad() {
    // this.getCode();
	
  },
  methods: {
    getCode() {
      const that = this;
      uni.login({
        provider: "weixin",
        success: function (loginRes) {
          that.code = loginRes.code;
        },
      });
    },
    login_info() {
      let that = this;
      uni.getUserProfile({
        desc: "用于登录后的信息绑定和显示",
        success(res) {
          uni.showToast({
            title: "授权成功",
            duration: 2000,
            icon: "success",
          });
          let paramData = {
            code: that.code,
            encryptedData: res.encryptedData,
            iv: res.iv,
          };
          console.log(paramData, "paramData");
          that.welogin(paramData);
        },
        fail(err) {
          uni.showToast({
            title: "您拒绝了授权",
            duration: 2000,
            icon: "error",
          });
        },
      });
    },
    welogin(paramData) {
      this.http.post("user/welogin", paramData)
	  .then((result) => {
        if (result.code == 1) {
          uni.setStorageSync("token", result.data.token);
		  uni.setStorageSync("userInfo", JSON.stringify(result));
		  
          uni.showToast({
            title: "登录成功",
            icon: "none",
          });
		  this.websocketStart()
          setTimeout(() => {
            uni.reLaunch({
              url: "/pages/tabbar/tab-1",
            });
          }, 1000);
        }
      });
    },
	websocketStart() {
		this.websocket = new WebSocket("wss://app.shiyijia.vip:8282");
		this.websocket.connect()
		console.log(this.websocket);
		this.websocket.onMessage(result => {
			console.log('app.js收到服務器内容：' +result.data);
			uni.$emit('updatechatFn', "")
			uni.$emit('updatechatFnList', "")
		})
	},
	//账号密码登录
	login(){
		if (!this.phone || !this.psw){
			uni.showToast({
				title: "请输入账号密码",
				icon:"none"
			})
			return;
		}
		if (!this.checked) {
			uni.showToast({
				title: "请先阅读并同意应用 用户协议 及 隐私政策",
				icon:"none"
			})
			return;
		}
		let param = {
			account : this.phone,
			password : this.psw
		};
		this.http.post('user/login',param).then((res) => {
			console.log('-=-=-==',res);
			if (res.code == 1) {
				uni.setStorageSync('token',res.data.userinfo.token);
				uni.setStorageSync('userInfo',res.data.userinfo);
				uni.setStorageSync('user_id',res.data.userinfo.user_id);
				uni.setStorageSync('group_id',res.data.userinfo.group_id);
				// uni.setStorageSync("token", res.data.token);
				// uni.setStorageSync("userInfo", JSON.stringify(res));
				uni.showToast({
				  title: "登录成功",
				  icon: "none",
				});
				this.websocketStart()
				setTimeout(() => {
				  uni.switchTab({
				    url: "/pages/tabbar/tab-1",
				  });
				}, 1000);
			} else{
				uni.showToast({
					title: res.msg,
					icon:"none"
				})
			}
		});
	},
	
	//用户协议
	userAgreement(type){
		uni.navigateTo({
			url:'/pages/login/xy?type='+type
		})
	},
	//隐私协议
	privacyPolicy(){
		uni.navigateTo({
			url:'/pages/login/agreement_file?event=privacy'
		})
	},
	//重置密码
	resetPassword(){
		uni.navigateTo({
			url:'/pages/login/restPassword'
		})
	},
	//注册
	register(){
		uni.navigateTo({
			url:'/pages/login/register'
		})
	}
  },
};
</script>

<style lang="scss" scoped>
.logo_logo {
  margin-top: 150rpx;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  color: #0396fd;
  font-size: 40rpx;
  color: #150e33;
  font-weight: 600;
  image {
    width: 200rpx;
    height: 200rpx;
    margin-bottom: 20rpx;
  }
}
.login_btn {
  margin-top: 20rpx;
  width: 98rpx;
  height: 98rpx;
  background-color: #1bd66c;
  display: flex;
  align-items: center;
  color: #fff;
  border-radius: 49rpx;
  justify-content: center;
  image {
    width: 55rpx;
    height: 44rpx;
  }
}

	
	.form{
		width: 750rpx;
		padding:0 64rpx ;
		margin-top: 200rpx;
		box-sizing: border-box;
	}
	.form-item{
		width: 100%;
		padding: 30rpx 0;
		border-bottom: 1px solid #f1f1f1;
		position: relative;
		.eye-box{
			height: 100%;
			display:flex;
			width: 44rpx;
			align-items: center;
			position: absolute;
			right: 0;
			bottom: 0;
		}
		.eye{
			width: 44rpx;
			height: 30rpx;
			
			
		}
	}
	.ipt-placeholder{
		color: #dfdfdf;
		font-size: 32rpx;
	}
	.go_login{
		height: 100rpx;
		width: 100%;
		line-height: 80rpx;
		text-align: center;
		color: #000000;
		font-size: 30rpx;
		display: flex;
		justify-content: center;
		.inner_view{
			display: flex;
			align-items: center;
		}
		.line{
			display: block;
			height: 30rpx;
			width: 1px;
			background-color: #999;
			margin: 0 20rpx;
		}
		
	}
	.register_btn{
		height: 88rpx;
		width: 622rpx;
		margin-left: 64rpx;
		line-height: 80rpx;
		text-align: center;
		background-color: $uni-color-primary;
		border-radius: 8rpx;
		margin-top: 80rpx;
		color: #fff;
	}
    .bottom{
		position: fixed;
		bottom: 40rpx;
		width: 100vw;
		margin-top: 20rpx;
		// height: 80rpx;
		padding-bottom: constant(safe-area-inset-bottom);/*兼容 IOS<11.2*/
		padding-bottom: env(safe-area-inset-bottom); /*兼容 IOS>11.2*/
		
		display: flex;
		justify-content: center;
		.btns{
			
			box-sizing: border-box;
			display: flex;
			align-items: center;
			.colortext{
				color: $uni-color-primary;
			}
			
		}
		
	}
</style>